import React from 'react'
import { useLocation ,useNavigate } from 'react-router-dom'
import {  NavBar ,Tag} from "antd-mobile";
import { Divider } from 'react-vant';
import img from "../../assets/1.png";
import './index.scss'

const Index:React.FC = () => {
  const navigate = useNavigate()
  const location = useLocation()
  const [data, setData] = React.useState(location.state)
  console.log(data);
  
  
  const back = () => {
    navigate(-1);
  };
  return (
    <div className='box'>
      <header>
         <NavBar
        onBack={back}
      >在线咨询</NavBar>
      </header>  
  
        <main>
          <dl className='dls'>
            <dt><img src={img} alt="" /></dt>
            <dd>
                <div>
                  <p>{data.name}</p>
                  <p>{data.level}&emsp;{data.Department}</p>
                  <p>{data.yi}<Tag color="#ffe1e1">三甲</Tag></p>
                </div>
            </dd>
        </dl>
        <div className='title'>
          <div className="one">
            <p>暂无</p>
            <p>挂号量</p>
          </div>

          <div className="one">
            <p>7</p>
            <p>咨询量</p>
          </div>

          <div className="one">
            <p>100%</p>
            <p>好评率</p>
          </div>

          <div className="one">
            <p>25</p>
            <p>粉丝数</p>
          </div>
        </div>
        <p>擅长：阿是垦利街道卡洛斯京东卡收垃圾大阿萨达四大</p>
          <div className='content'>
           
        <span>阿是垦利街道卡洛斯京东卡收垃圾大阿萨达四大</span><span>查看全部</span>
        </div>
        </main>
      
     <h2 id='xun'>在线咨询</h2>

     <Divider style={{ color: '#3f45ff', borderColor: '#3f45ff', padding: '0 16px' }}>
    让医疗健康不再难
    </Divider>
    </div>
  )
}

export default Index
